<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  
  
    <meta name="keywords" content="前端,Vue.js,JavaScript,Node.js,小程序">
  
  
    <meta name="description" content="GuoYou.Li(李国有)的博客, 用于做学习过程中的笔记、总结以及知识分享">
  
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>
    基于 Hexo 搭建 Gitee 个人静态博客 |
    
    种子的信仰</title>
  
    <link rel="shortcut icon" href="/your/favicon.ico">
  
  
<link rel="stylesheet" href="/your/css/style.css">

  
    
<link rel="stylesheet" href="/your/fancybox/jquery.fancybox.min.css">

  
  
<script src="/your/js/pace.min.js"></script>

<meta name="generator" content="Hexo 4.2.1"><link rel="alternate" href="/your/atom.xml" title="种子的信仰" type="application/atom+xml">
</head>

<body>
<main class="content">
  <section class="outer">
  <article id="post-build-a-blog-based-on-hexo" class="article article-type-post" itemscope itemprop="blogPost" data-scroll-reveal>

    <div class="article-inner">
        
            <header class="article-header">
                
  
    <h1 class="article-title" itemprop="name">
      基于 Hexo 搭建 Gitee 个人静态博客
    </h1>
  
  




            </header>
            

                
                    <div class="article-meta">
                        <a href="/your/2020/05/29/build-a-blog-based-on-hexo/" class="article-date">
  <time datetime="2020-05-28T16:04:28.000Z" itemprop="datePublished">2020-05-29</time>
</a>
                            
  <div class="article-category">
    <a class="article-category-link" href="/your/categories/%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0/">学习笔记</a> / <a class="article-category-link" href="/your/categories/%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0/Hexo/">Hexo</a>
  </div>

                    </div>
                    

                        
                            
    <div class="tocbot"></div>





                                

                                    <div class="article-entry" itemprop="articleBody">
                                        


                                            

                                                
                                                                    <h2 id="一-首次搭建博客"><a href="#一-首次搭建博客" class="headerlink" title="一.首次搭建博客"></a>一.首次搭建博客</h2><p><em>本文默认你已经安装了 Node.js 环境以及 npm 或者 yarn 资源管理工具</em></p>
<p><a href="https://liguoyou.gitee.io/your/2020/08/10/install-yarn-through-nodejs-and-npm/">使用 Node.js 和 npm 安装和配置 Yarn</a></p>
<h3 id="1-全局安装-Hexo"><a href="#1-全局安装-Hexo" class="headerlink" title="1. 全局安装 Hexo"></a>1. 全局安装 Hexo</h3><p>本文使用的是 <code>yarn</code></p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">yarn global add hexo-cli</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">npm install -g hexo-cli</span><br></pre></td></tr></table></figure>

<h3 id="2-初始化文件夹"><a href="#2-初始化文件夹" class="headerlink" title="2. 初始化文件夹"></a>2. 初始化文件夹</h3><p>创建文件夹 <del>hexo</del> your (<strong>后面我把文件夹名改成了 your, 保持和访问的根目录一致</strong>),</p>
<p>在 <del>hexo</del> your 中打开 git Bash, 执行:</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 网速不好的话, 这里可能需要点时间</span></span><br><span class="line">hexo init</span><br></pre></td></tr></table></figure>

<p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-20200526204940892.png" alt="init 成功"></p>
<p>init 后目录如下, 关于目录及文件的说明请查看<a href="https://hexo.io/zh-cn/docs/setup" target="_blank" rel="noopener">官方文档(中文)</a></p>
<p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-20200526205207269.png" alt="init 生成的目录"></p>
<h3 id="3-命令使用介绍"><a href="#3-命令使用介绍" class="headerlink" title="3. 命令使用介绍"></a>3. 命令使用介绍</h3><p>打开代码, 从 <code>package.json</code> 文件中可以看到:</p>
<p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-20200526210826688.png" alt="package.json"></p>
<p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-20200526211114174.png" alt="hexo s"></p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 编译 生成静态文件(public), 该目录为最终预览的静态文件</span></span><br><span class="line">yarn build</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo generate</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo g</span><br></pre></td></tr></table></figure>

<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 启动服务, 启动服务, 打开地址可以本地 http://localhost:xxxx 预览页面</span></span><br><span class="line">yarn serve</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo server</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo s</span><br></pre></td></tr></table></figure>

<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 清除缓存文件 (db.json) 和已生成的静态文件 (public)。</span></span><br><span class="line"><span class="comment"># 如果发现您对站点的更改无论如何也不生效，您可能需要运行该命令</span></span><br><span class="line">yarn clean</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo clean</span><br></pre></td></tr></table></figure>

<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 命令简写</span></span><br><span class="line">hexo clean &amp;&amp; hexo g &amp;&amp; hexo s</span><br></pre></td></tr></table></figure>

<h3 id="4-首次运行如图"><a href="#4-首次运行如图" class="headerlink" title="4. 首次运行如图"></a>4. 首次运行如图</h3><p>默认主题 landscape</p>
<p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-20200526210938239.png" alt="首次运行"></p>
<h2 id="二-安装主题"><a href="#二-安装主题" class="headerlink" title="二.安装主题"></a>二.安装主题</h2><h3 id="1-选择主题"><a href="#1-选择主题" class="headerlink" title="1. 选择主题"></a>1. 选择主题</h3><p>本文选择的主题是 <a href="https://zhwangart.github.io/" target="_blank" rel="noopener">Ocean</a>,</p>
<p>在<a href="https://hexo.io/themes/" target="_blank" rel="noopener">官方的主题</a>里面选择一个你喜欢的主题, 按照主题的<a href="https://zhwangart.github.io/2018/11/30/Ocean/" target="_blank" rel="noopener">文档</a>来就好</p>
<p>下载好慢….等等等…</p>
<h3 id="2-遇到的问题"><a href="#2-遇到的问题" class="headerlink" title="2.遇到的问题:"></a>2.遇到的问题:</h3><p><strong>(1) Cannot GET /js/search.js 404 这个问题搞了好久好久:</strong></p>
<p>一开始按照作者的文档操作配置:</p>
<blockquote>
<p>安装插件依赖<br><code>yarn add hexo-generator-searchdb</code></p>
<p>在 <code>./_config.yml</code> 中添加配置 (注意: 这不是 ocean 中的)</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 本地检索 hexo-generator-searchdb</span></span><br><span class="line">search:</span><br><span class="line">  path: search.xml</span><br><span class="line">  field: post</span><br><span class="line">  content: <span class="literal">true</span></span><br></pre></td></tr></table></figure>

</blockquote>
<p>然后就报错 Cannot GET /js/search.js 404!!</p>
<p>下面是解决历程:</p>
<p><strong>首先</strong>, 按照 <a href="https://github.com/zhwangart/gitalk/issues/7" target="_blank" rel="noopener">关于搜索问题 sevilen 同学给了一个详细的步骤</a></p>
<p>在 <code>\themes\ocean\layout\_partial\after-footer.ejs</code> 中配置(<strong>此方法不行</strong>)</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 不管是这个写法 js/</span></span><br><span class="line">&lt;% <span class="keyword">if</span> (theme.search)&#123; %&gt;</span><br><span class="line">  &lt;%- js(<span class="string">'js/search'</span>) %&gt;</span><br><span class="line">&lt;% &#125; %&gt;</span><br><span class="line"><span class="comment"># 还是这个写法 /js/</span></span><br><span class="line">&lt;% <span class="keyword">if</span> (theme.local_search.enable)&#123; %&gt;</span><br><span class="line">  &lt;%- js(<span class="string">'/js/search'</span>) %&gt;</span><br><span class="line">&lt;% &#125; %&gt;</span><br></pre></td></tr></table></figure>

<p>然而都没有起作用. 甚至因为我没有 local_search 配置而导致报错..</p>
<p>然后又试了下面的方法: 直接找到加载 js 的地方修改路径(<strong>此方法不行</strong>)</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// themes\ocean\source\js\ocean.js</span></span><br><span class="line"><span class="comment">// 原代码</span></span><br><span class="line">\$.getScript(<span class="string">'/js/search.js'</span>,</span><br><span class="line"><span class="comment">// 修改为</span></span><br><span class="line">\$.getScript(<span class="string">'js/search.js'</span>,</span><br><span class="line">             </span><br><span class="line"><span class="comment">// 原代码</span></span><br><span class="line">searchFunc(<span class="string">"/search.xml"</span>,</span><br><span class="line"><span class="comment">// 修改为</span></span><br><span class="line">searchFunc(<span class="string">"search.xml"</span>,</span><br></pre></td></tr></table></figure>

<p>首页可以了! 内页还是不行啊, 一看控制台 network 请求失败的链接, 居然把路径拼在了整个地址的最后, 好无奈:</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">http:&#x2F;&#x2F;localhost:4000&#x2F;your&#x2F;2020&#x2F;05&#x2F;29&#x2F;build-a-blog-based-on-hexo&#x2F;js&#x2F;search.js?_&#x3D;1590852138728</span><br></pre></td></tr></table></figure>

<p><strong>终极方案, 最后使用了一种不是很好的办法解决了</strong></p>
<p>在文件路径前面添加根路径<code>/your/</code> (这是在 _config.yml 中的配置 <code>root: /your/</code>, 也就是我的博客根路径)</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// themes\ocean\source\js\ocean.js</span></span><br><span class="line"><span class="comment">// 原代码</span></span><br><span class="line">\$.getScript(<span class="string">'/js/search.js'</span>,</span><br><span class="line"><span class="comment">// 修改为</span></span><br><span class="line">\$.getScript(<span class="string">'/your/js/search.js'</span>,</span><br><span class="line"></span><br><span class="line"><span class="comment">// 原代码</span></span><br><span class="line">searchFunc(<span class="string">"/search.xml"</span>,</span><br><span class="line"><span class="comment">// 修改为</span></span><br><span class="line">searchFunc(<span class="string">"/your/search.xml"</span>,</span><br></pre></td></tr></table></figure>

<p>就<strong>ok</strong>了!  搞了快一天!</p>
<p><strong>(2) 首页的视频 / 图片 / 图标 / logo / favicon.ico 等无法正常显示</strong></p>
<p>图片的问题和上面类似, 直接写解决方案: 直接查看官方文档添加<a href="https://hexo.io/zh-cn/docs/helpers#url-for" target="_blank" rel="noopener">辅助函数 url_for</a>就可以顺利解决:</p>
<p><strong>修改以下文件</strong></p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// themes\ocean\layout\_partial\sidebar.ejs</span></span><br><span class="line"><span class="comment">// 原代码</span></span><br><span class="line">&lt;%- theme.brand %&gt;</span><br><span class="line"><span class="comment">// 修改为</span></span><br><span class="line">&lt;%- url_for(theme.brand) %&gt;</span><br><span class="line"></span><br><span class="line"><span class="comment">// themes\ocean\layout\_partial\head.ejs</span></span><br><span class="line"><span class="comment">// 原代码</span></span><br><span class="line">&lt;%- theme.favicon %&gt;</span><br><span class="line"><span class="comment">// 修改为</span></span><br><span class="line">&lt;%- url_for(theme.favicon) %&gt;</span><br></pre></td></tr></table></figure>

<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// themes\ocean\layout\_partial\ocean.ejs</span></span><br><span class="line"><span class="comment">// 原代码 有五处</span></span><br><span class="line">theme.ocean.path</span><br><span class="line"><span class="comment">// 修改为</span></span><br><span class="line">url_for(theme.ocean.path)</span><br><span class="line"></span><br><span class="line"><span class="comment">// 原代码</span></span><br><span class="line">&lt;%- theme.ocean.brand %&gt;</span><br><span class="line"><span class="comment">// 修改为</span></span><br><span class="line">&lt;%- url_for(theme.ocean.brand) %&gt;</span><br></pre></td></tr></table></figure>

<p><strong>(3) 修改文件, 比如修改样式部署之后不生效?</strong></p>
<p>一般是缓存文件问题, 试试:</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">hexo clean &amp;&amp; hexo g</span><br></pre></td></tr></table></figure>

<p><strong>(4) 关于很多的问题</strong></p>
<p>直接查看作者的这篇文章 <a href="https://zhwangart.github.io/2019/07/02/Ocean-Issues/" target="_blank" rel="noopener">关于 Ocean 使用中的问题</a>, 以及阅读 <a href="https://hexo.io/zh-cn/docs/" target="_blank" rel="noopener">Hexo 的文档</a>, 非常详细…</p>
<h3 id="3-重启项目即可查看新主题"><a href="#3-重启项目即可查看新主题" class="headerlink" title="3.重启项目即可查看新主题"></a>3.重启项目即可查看新主题</h3><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 清缓存&amp;编译&amp;重启</span></span><br><span class="line">hexo clean &amp;&amp; hexo g &amp;&amp; hexo s</span><br></pre></td></tr></table></figure>

<p>新的主题:</p>
<p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-2020052622121048722.png" alt="ocean"></p>
<h2 id="三-部署博客到-Gitee-上"><a href="#三-部署博客到-Gitee-上" class="headerlink" title="三.部署博客到 Gitee 上"></a>三.部署博客到 Gitee 上</h2><h3 id="1-首先到-Gitee-注册账号并创建仓库-例如-your-并开启-Gitee-pages-服务"><a href="#1-首先到-Gitee-注册账号并创建仓库-例如-your-并开启-Gitee-pages-服务" class="headerlink" title="1.首先到 Gitee 注册账号并创建仓库, 例如: your, 并开启 Gitee pages 服务"></a>1.首先到 Gitee 注册账号并创建仓库, 例如: your, 并开启 Gitee pages 服务</h3><p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-20200526235114597.png" alt="创建仓库及开启服务"></p>
<h3 id="2-配置-config-yml"><a href="#2-配置-config-yml" class="headerlink" title="2.配置 _config.yml"></a>2.配置 <code>_config.yml</code></h3><figure class="highlight yml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># URL</span></span><br><span class="line"><span class="comment">## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'</span></span><br><span class="line"><span class="attr">url:</span> <span class="string">http://liguoyou.gitee.io/your/</span> <span class="comment"># 修改为你的网站地址</span></span><br><span class="line"><span class="attr">root:</span> <span class="string">/your/</span> <span class="comment"># 你的网站根目录</span></span><br></pre></td></tr></table></figure>

<figure class="highlight yml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">deploy:</span></span><br><span class="line">  <span class="attr">type:</span> <span class="string">git</span></span><br><span class="line">  <span class="attr">repo:</span> <span class="string">git@gitee.com:liguoyou/your.git</span> <span class="comment"># 修改为你的仓库地址</span></span><br><span class="line">  <span class="attr">branch:</span> <span class="string">master</span></span><br></pre></td></tr></table></figure>

<h3 id="3-部署项目"><a href="#3-部署项目" class="headerlink" title="3.部署项目"></a>3.部署项目</h3><p><strong>(1).官方的部署方案:</strong></p>
<p>将 <code>public</code> 目录中的文件和目录推送至 <code>_config.yml</code> 中指定的远端仓库和分支中，并且<strong>完全覆盖</strong>该分支下的已有内容</p>
<p><a href="https://hexo.io/zh-cn/docs/one-command-deployment" target="_blank" rel="noopener">参照官网的部署文档</a></p>
<p><strong>(2).我这里的部署方案:</strong></p>
<p>我这里会将整个项目(your)都提交到 Gitee 的仓库</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 打包项目到 public</span></span><br><span class="line">yarn build</span><br><span class="line">或者</span><br><span class="line">hexo g</span><br><span class="line"></span><br><span class="line"><span class="comment"># 提交代码, 将整个仓库 your, 提交到gitee</span></span><br><span class="line">git add .</span><br><span class="line">git commit -m <span class="string">'更新'</span></span><br><span class="line">git push</span><br></pre></td></tr></table></figure>

<p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-20200527224538977.png" alt="push 到仓库后"></p>
<p>然后<strong>在Gitee pages 服务里设置部署目录为 public</strong> 即可</p>
<p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-20200527000632686.png" alt="设置部署目录为 public"></p>
<p><strong>每次提交后, 都需要点击更新按钮(付费用户听说会自动更新)</strong></p>
<h2 id="总结"><a href="#总结" class="headerlink" title="总结"></a>总结</h2><p><strong>常用命令</strong></p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 编译 生成静态文件(public), 该目录为最终预览的静态文件</span></span><br><span class="line">yarn build</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo generate</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo g</span><br><span class="line"></span><br><span class="line"><span class="comment"># 启动服务, 启动服务, 打开地址可以本地 http://localhost:xxxx 预览页面</span></span><br><span class="line">yarn serve</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo server</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo s</span><br><span class="line"></span><br><span class="line"><span class="comment"># 清除缓存文件 (db.json) 和已生成的静态文件 (public)。</span></span><br><span class="line"><span class="comment"># 如果发现您对站点的更改无论如何也不生效，您可能需要运行该命令</span></span><br><span class="line">yarn clean</span><br><span class="line"><span class="comment"># 或者</span></span><br><span class="line">hexo clean</span><br><span class="line"><span class="comment"># 命令简写</span></span><br><span class="line">hexo clean &amp;&amp; hexo g &amp;&amp; hexo s</span><br><span class="line"></span><br><span class="line"><span class="comment"># 添加文件到缓存区</span></span><br><span class="line">git add .</span><br><span class="line"><span class="comment"># 提交文件</span></span><br><span class="line">git commit -m <span class="string">'备注信息'</span></span><br><span class="line"><span class="comment"># 推送代码到仓库</span></span><br><span class="line">git push</span><br></pre></td></tr></table></figure>

<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># 新建文章, 会在 source/post 中生成一篇文章和对应的文件夹</span></span><br><span class="line"><span class="comment"># hexo new [layout] &lt;title&gt;</span></span><br><span class="line">hexo new post <span class="built_in">test</span></span><br><span class="line"><span class="comment"># 如果 _config.yml 中配置了 default_layout: post. 则 [layout] 可以省略</span></span><br><span class="line">hexo new test2</span><br></pre></td></tr></table></figure>

<p><img src="https://gitee.com/liguoyou/pic/raw/master/images/image-20210904235149507.png" alt="image-20210904235149507"></p>
<p>我通常使用 Git 分支来管理新文章/草稿/修改文章等 <a href="https://liguoyou.gitee.io/your/2020/05/31/summary-of-git/">Git 常用操作命令总结</a>,</p>
<p>当然也可以使用 <a href="https://hexo.io/zh-cn/docs/writing#%E8%8D%89%E7%A8%BF" target="_blank" rel="noopener">hexo 的草稿相关命令</a></p>
<p><strong>工具推荐</strong></p>
<ul>
<li>我这里使用 VsCode 编辑器对整个项目 (your) 进行修改维护</li>
<li>使用 Git 作为版本工具管理</li>
<li>使用 <a href="https://typora.io/" target="_blank" rel="noopener">Typora </a>编写 MarkDown 文档</li>
<li>使用 <a href="https://github.com/Molunerfinn/PicGo/releases" target="_blank" rel="noopener">PicGo图床工具</a> + Gitee 管理图片</li>
</ul>
<p>— <strong>切记, 遇事冷静思考, 不要烦躁. 即使你真的会很烦</strong> —</p>
<h2 id="参考"><a href="#参考" class="headerlink" title="参考"></a>参考</h2><p><a href="https://hexo.io/zh-cn/docs/" target="_blank" rel="noopener">Hexo 官方文档</a> 真的很详细很全面</p>
<p><a href="https://zhwangart.github.io/2018/11/30/Ocean/" target="_blank" rel="noopener">Ocean 中文文档 - zhwangart</a></p>
<p><a href="https://zhwangart.github.io/2019/07/02/Ocean-Issues/" target="_blank" rel="noopener">关于 Ocean 使用中的问题 - zhwangart</a></p>
<p><a href="https://zhwangart.github.io/2018/12/06/Gitalk/" target="_blank" rel="noopener">Gitalk 的使用 - zhwangart</a></p>
<p><a href="https://segmentfault.com/a/1190000018662692" target="_blank" rel="noopener">基于 Gitee+Hexo 搭建个人博客 - segmentfault</a></p>
<p><a href="https://www.jianshu.com/p/5014133ba61a" target="_blank" rel="noopener">使用 Gitee+Hexo 搭建个人博客 - 简书</a></p>
<p><a href="https://mdnice.com/writing/8188b5183a5d4860a8f33bc0fa4b2d28" target="_blank" rel="noopener">又是白嫖Gitee的一天，PicGo+Gitee搭建图床，用过的都说真香！！！</a></p>

                                                                        
                                    </div>
                                    <footer class="article-footer">
                                        <!-- 注释 - 分享按钮 -->
                                        <!-- <a data-url="http://liguoyou.gitee.io/your/2020/05/29/build-a-blog-based-on-hexo/" data-id="cl0gvpjp10001m4on5tiieay3" class="article-share-link">
                                            分享
                                        </a> -->
                                        
  <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/your/tags/Hexo/" rel="tag">Hexo</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/your/tags/Ocean/" rel="tag">Ocean</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/your/tags/%E9%9D%99%E6%80%81%E5%8D%9A%E5%AE%A2/" rel="tag">静态博客</a></li></ul>

                                    </footer>

    </div>

    
        
  <nav class="article-nav">
    
      <a href="/your/2020/05/31/301-moved-permanently/" class="article-nav-link">
        <strong class="article-nav-caption">前一篇</strong>
        <div class="article-nav-title">
          
            301 Moved Permanently (from disk cache)
          
        </div>
      </a>
    
    
  </nav>


            

                
                    
                        
  <div class="gitalk" id="gitalk-container"></div>
  <p style="color: #999; font-size: 12px; text-align: center;">
    第三方评论系统 -- Gitalk: 偶尔可能出现加载失败的情况, 您可以选择刷新或者前往 
    <a href="https://github.com/liguoyou/your/issues" target="_blank">issues</a>
    提交和查看评论
  </p>
  
<link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">

  
<script src="https://unpkg.com/gitalk/dist/gitalk.min.js"></script>

  
<script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.min.js"></script>

  <script type="text/javascript">
    var gitalk = new Gitalk({
      clientID: '2e731d2b04096a7c71ab',
      clientSecret: '41e2e15eb8edebd8efd5a6da558a44d60f33468a',
      repo: 'your',
      owner: 'liguoyou',
      admin: ['liguoyou'],
      // id: location.pathname,      // Ensure uniqueness and length less than 50
      id: md5(location.pathname),
      distractionFreeMode: false,  // Facebook-like distraction free mode
      pagerDirection: 'last'
    })

  gitalk.render('gitalk-container')
  </script>

                            

</article>
</section>
  <footer class="footer">
  <div class="outer">
    <div class="float-right">
      <ul class="list-inline">
  
    <li><i class="fe fe-smile-alt"></i> <span id="busuanzi_value_site_uv"></span></li>
  
    <li><i class="fe fe-bookmark"></i> <span id="busuanzi_value_page_pv"></span></li>
  
</ul>
    </div>
    <ul class="list-inline">
      <li>&copy; 2022 种子的信仰</li>
      <li>Powered by <a href="http://hexo.io/" target="_blank">Hexo</a></li>
      <li>Theme  <a href="https://github.com/zhwangart/hexo-theme-ocean" target="_blank" rel="noopener">Ocean</a></li>
    </ul>
  </div>
</footer>

</main>
<aside class="sidebar">
  <button class="navbar-toggle"></button>
<nav class="navbar">
  
    <div class="logo">
      <a href="/your/"><img src="/your/images/logo.png" alt="种子的信仰"></a>
    </div>
  
  <ul class="nav nav-main">
    
      <li class="nav-item">
        <a class="nav-item-link" href="/your/">首页</a>
      </li>
    
      <li class="nav-item">
        <a class="nav-item-link" href="/your/archives">时间轴</a>
      </li>
    
      <li class="nav-item">
        <a class="nav-item-link" href="/your/gallery">相册</a>
      </li>
    
      <li class="nav-item">
        <a class="nav-item-link" href="/your/categories">分类</a>
      </li>
    
      <li class="nav-item">
        <a class="nav-item-link" href="/your/tags">标签</a>
      </li>
    
      <li class="nav-item">
        <a class="nav-item-link" href="/your/about">关于</a>
      </li>
    
    <li class="nav-item">
      <a class="nav-item-link nav-item-search" title="搜索">
        <i class="fe fe-search"></i>
        搜索
      </a>
    </li>
  </ul>
</nav>
<nav class="navbar navbar-bottom">
  <ul class="nav">
    <li class="nav-item">
      <div class="totop" id="totop">
  <i class="fe fe-rocket"></i>
</div>
    </li>
    <li class="nav-item">
      
        <a class="nav-item-link" target="_blank" href="/your/atom.xml" title="RSS Feed">
          <i class="fe fe-feed"></i>
        </a>
      
    </li>
  </ul>
</nav>
<div class="search-form-wrap">
  <div class="local-search local-search-plugin">
  <input type="search" id="local-search-input" class="local-search-input" placeholder="请输入关键词...">
  <div id="local-search-result" class="local-search-result"></div>
</div>
</div>
</aside>

<script src="/your/js/jquery-2.0.3.min.js"></script>


<script src="/your/js/jquery.justifiedGallery.min.js"></script>


<script src="/your/js/lazyload.min.js"></script>


<script src="/your/js/busuanzi-2.3.pure.min.js"></script>


  
<script src="/your/fancybox/jquery.fancybox.min.js"></script>




  
<script src="/your/js/tocbot.min.js"></script>

  <script>
    // Tocbot_v4.7.0  http://tscanlin.github.io/tocbot/
    tocbot.init({
      tocSelector: '.tocbot',
      contentSelector: '.article-entry',
      headingSelector: 'h1, h2, h3, h4, h5, h6',
      hasInnerContainers: true,
      scrollSmooth: true,
      positionFixedSelector: '.tocbot',
      positionFixedClass: 'is-position-fixed',
      fixedSidebarOffset: 'auto',
    });
  </script>


<script src="/your/js/ocean.js"></script>


</body>
</html>